<%@page import="com.xnx3.j2ee.Global" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://www.xnx3.com/java_xnx3/xnx3_tld" prefix="x" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<jsp:include page="../iw/common/head.jsp">
    <jsp:param name="title" value="文章列表"/>
</jsp:include>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"  media="all">
<style>
    .body {
        margin: 0;
        padding: 0px;
        height: 100%;
        overflow: hidden;
    }

    .menu {
        width: 160px;
        height: 100%;
        background-color: #EAEDF1;
        position: absolute;
    }

    /* 左侧栏目列表的文字 */
    .layui-nav-tree .layui-nav-item a {
        color: #333;
    }

    /*鼠标移动到某项后的样式*/
    .layui-nav-tree .layui-nav-item a:hover:HOVER {
        background-color: #f4f6f8;
        color: #222;
    }

    /*子栏目*/
    .layui-nav-tree .layui-nav-item dl dd a {
        padding-left: 35px;
    }

    .dltitle {
        background-color: #EAEDF1;
    }

    .layui-nav-itemed > a, .layui-nav-tree .layui-nav-title a, .layui-nav-tree .layui-nav-title a:hover {
        background-color: #EAEDF1 !important;
        color: #222 !important;
    }

    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th {
        line-height: 2.2;
        text-align: center;
    }

    .layui-nav-child dd {
        background-color: #EAEDF1;
    }

    .layui-nav .layui-nav-item .layui-nav-more {
        border-top-color: rgba(64, 34, 34, 0.7);
    }

    /*有二级栏目的，二级栏目伸缩的时候，右侧的小尖头的颜色*/
    .layui-nav .layui-nav-itemed .layui-nav-more {
        border-top-color: rgba(64, 34, 34, 0);
        border-color: transparent transparent #a42828;
    }

    th, td {
        text-align: center !important;
    }

    #xnx3_page {
        width: 100%;
        padding-top: 15px;
        padding-bottom: 20px;
    }

    #xnx3_page ul {
        width: 100%;
        text-align: center;
    }

    #xnx3_page ul li {
        display: inline-block;
        vertical-align: middle;
        border: 1px solid #e2e2e2;
        background-color: #fff;
        padding-right: 1px;
        padding-left: 1px;
    }

    #xnx3_page ul .xnx3_page_currentPage, #xnx3_page ul .xnx3_page_currentPage a {
        background-color: #009688;
        color: #fff;
    }
    .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
        background-color: #28a44d;
        border-color: #ffffff;
    }
    .layui-btn {
        background-color: #0bb20c;
    }
    #xnx3_page ul li a {
        padding: 0 15px;
        height: 30px;
        line-height: 30px;
        background-color: #fff;
        color: #333;
    }
    /*.edit_btn,*/
    /*.del_btn{*/
        /*padding:5px 10px ;*/
        /*background: #000;*/
    /*}*/
</style>

<div style="width:100%;height:100%; background-color: #fff; overflow-x: hidden;">

    <%--<div class="layui-nav layui-nav-tree layui-nav-side menu">--%>
        <%--<div style="height: 65px;text-align: left;line-height: 65px;font-size: 16px;font-weight: 700;color: black;padding-left: 18px;">--%>
            <%--产品管理--%>
        <%--</div>--%>

        <%--<ul class="">--%>
            <%--<li class="layui-nav-item wangYeDeYanSe">--%>
                <%--<a id="addProduct" href="<%=basePath %>productManagement/productAddList.do" class="wangYeDeYanSe">新增产品</a>--%>
            <%--</li>--%>
        <%--</ul>--%>
    <%--</div>--%>

    <div style="width:100%;height:100%;position: absolute;word-wrap: break-word;border-right: 170px;box-sizing: border-box; padding-right: 10px; overflow-y: auto;overflow-x: hidden; ">

            <div style="margin-bottom: 30px;margin-top: 30px;margin-left: 20px;">
                <label>产品名称：</label>
                <span><input id="productName" name="productName" type="text" style="height: 30px">
               <%--<label>产品价格：</label> <input type="text" id="price" name="price" style="height: 30px">--%>
               <label>产品类型：</label>
                <select id="type" style="height: 35px;width: 150px">
                    <option name="type" id="" value="">请选择</option>
                    <c:forEach items="${type}" var="type">
                        <option name="type"  value="${type.id}">${type.name}</option>
                    </c:forEach>
                </select>
               <input class="layui-btn iw_list_search_submit" id="btn_sch" onclick="page_box()" type="button" value="搜索"/></span>
            </div>

        <table class="layui-table iw_table">
            <thead>
            <tr>
                <th>编号</th>
                <th>产品名称</th>
                <th>产品价格</th>
                <th>产品描述</th>
                <th>产品类型</th>
                <th>产品图片</th>
                <th>发布时间</th>
                <th>修改时间</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody id="loadDatas">
            </tbody>
        </table>
        <!-- 通用分页跳转 -->
        <div class="page_all"><ul class="pagination" id="page"></ul></div>
    </div>
</div>

<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="http://118.25.235.213:8030/js/jqPaginator/src/js/jqPaginator.js"></script>

<script type="text/javascript">
    var counts='';
    var pages='';
    var currentPage='';
    function page_box(){
        $.jqPaginator('#page',{
            totalCounts: counts,
            pageSize:10,
            currentPage: currentPage,
            visiblePages: 5,
            first: '<li class="first"><a href="javascript:void(0);">首页</a></li>',
            prev: '<li class="prev"><a href="javascript:void(0);">上一页</a></li>',
            next: '<li class="next"><a href="javascript:void(0);">下一页</a></li>',
            last: '<li class="last"><a href="javascript:void(0);">末页</a></li>',
            page: '<li class="page"><a href="javascript:void(0);">{{page}}</a></li>',
            onPageChange: function (num) {
                var productName=$("#productName").val(),type=$('#type').val();
                $.ajax({
                    url:"<%=basePath %>productManagement/eidtproductList.do",
                    type:'post',
                    data:{
                        page : num,
                        productName:productName,
                        type:type,
                    },
                    cache : false,
                    success:function(json){
                        listdata(json)
                    },
                    error:function(){
                        layer.msg("加载失败", {icon: 2});
                    }
                })
            }
        });
    }
    function loadData(){
        var productName=$("#productName").val(),type=$('#type').val();
        $.ajax({
            url:"<%=basePath %>productManagement/eidtproductList.do",
            data:{
                productName:productName,
                type:type,
                page:1
            },
            dataType:'JSON',
            type:"post",
            success:function(result){
                counts=result.pctList.totalCount;
                pages=result.pctList.totalPage;
                currentPage=result.pctList.currentPage;
                page_box(counts,pages)
            }
        })
    }

    function listdata(result){
        var jsons=result.pctList.productList,html='';

        var types=result.type,type_id='',type_name="";

        var options='';
        var c_page=result.pctList.currentPage;
        $.each(jsons,function(index,item){
            var imgPath=item.imgPath=='undefined'?'--':item.imgPath;
            var siteColumnId=item.siteColumnId.toString();
            html+='<tr>' +
                '<td>'+((c_page-1)*10 +index+1)+'</td>' +
                '<td>'+item.productName+'</td>' +
                '<td>'+item.price+'</td>' +
                '<td>'+item.prodoctDescription+'</td>' +
                '<td>' +
                '<div style="width:100px;overflow:hidden;">' +
                '<select disabled class="ele_type" style="text-align:center!important;padding-left:15px;width:120px;border:none;background:transparent"' +
                'value='+ item.siteColumnId +'>';
                var options='';
                    for(var i=0;i<types.length;i++){
                        if(types[i].id==item.siteColumnId){
                            options+='<option value="'+types[i].id+'" selected>'+types[i].name+'</option>';
                        }
                    }
            html+=options+'</select>' +
                '</div>' +
                '</td>'+
                '<td><img style="width:200px;" src="<%=basePath%>'+imgPath +'"></td>' +
                '<td>'+item.timestamps+'</td>' +
                '<td>'+item.modifyTime+'</td>' +
                '<td>' +
                '<button class="layui-icon layui-btn layui-btn-sm" onclick="updateProduct('+item.id+');">&#xe642;</button>' +
                '<button style="margin-left:10px;" onclick="deleteNews('+item.id+')" class="layui-icon layui-btn layui-btn-sm">&#xe640;</button>' +
                '</td>'+
                '</tr>'

        })
        $('#loadDatas').empty().html(html);
    }
    $(function () {
        loadData();
    })
    layui.use('element', function () {
        var element = layui.element;
    });
    var laydate;
    layui.use('laydate', function () {
        laydate = layui.laydate;
    });
    /**
     *    更改 addtime 发布时间
     *    id 绑定元素的id，在哪个元素上显示
     */
    function updateAddtime(id, value) {
        laydate.render({
            elem: '#addtime_' + id + '_input' //指定元素
            , type: 'datetime'
            , format: 'yyyy-MM-dd HH:mm:ss' //可任意组合
            , value: value //必须遵循format参数设定的格式
            , show: true //直接显示
            , closeStop: '#addtime_' + id //这里代表的意思是：点击 test1 所在元素阻止关闭事件冒泡。如果不设定，则无法弹出控件
            , done: function (value, date, endDate) {
                //判断是否有过修改
                if (typeof(value) == 'undefined' || value == null) {
                    return;
                }
                //旧的，原始值
                var oldValue = document.getElementById('addtime_' + id + '_input').value;
                if (typeof(oldValue) == 'undefined' || oldValue == null) {
                    oldValue = '';
                }

                if (oldValue != value) {
                    //确实修改了，那么保存

                    iw.loading("修改中");
                    $.post("updateAddtime.do?id=" + id + "&addtime=" + value, function (data) {
                        iw.loadClose();
                        if (data.result == '1') {
                            parent.iw.msgSuccess("修改成功");
                            location.reload();
                        } else if (data.result == '0') {
                            parent.iw.msgFailure(data.info);
                        } else {
                            parent.iw.msgFailure();
                        }
                    });

                }
            }
        });
    }

    /**
     * 编辑产品
     * **/
    function updateProduct(pctListId) {
        window.location.href = '<%=basePath %>productManagement/productAddList.do?id=' + pctListId;
    }

    /**
     * 删除新闻，传入要删除的新闻id
     */
    function deleteNews(pctListId) {
        var dtv_confirm = layer.confirm('删除后不可恢复，您确定要删除此条信息吗？', {
            btn: ['删除', '取消'] //按钮
        }, function () {
            layer.close(dtv_confirm);
            iw.loading("删除中");
            $.post("<%=basePath %>productManagement/delProduct.do?id=" + pctListId, function (data) {
                iw.loadClose();
                if (data.result == '1') {
                    parent.iw.msgSuccess("删除成功");
                    location.reload();
                } else if (data.result == '0') {
                    parent.iw.msgFailure(data.info);
                } else {
                    parent.iw.msgFailure();
                }
            });
        }, function () {
        });
    }

    /**
     * 编辑页面的内容代码， 复制于模板页面列表
     * 页面类型为独立页面
     * @param name TemplatePage.name要编辑的模版页面名字
     */
    function editText(name) {
        if (parent.currentMode == 2) {
            //要将其切换回智能模式
            parent.window.htmledit_mode();
        }

        try {
            parent.document.getElementById("currentTemplatePageName").value = name;
            parent.loadIframe();
        } catch (err) {
        }

        try {
            parent.document.getElementById("currentTemplateType").innerHTML = '详情页模版';
            parent.document.getElementById("tongyong").style.display = '';
            parent.document.getElementById("lanmu").style.display = '';
            parent.document.getElementById("fenye").style.display = 'none';
            parent.document.getElementById("wenzhang").style.display = '';
            parent.document.getElementById("dongtailanmu").style.display = '';
            parent.document.getElementById("xiangqingduyou").style.display = '';
            parent.document.getElementById("liebiaoduyou").style.display = 'none';
        } catch (err) {
        }

        //try{
        parent.layer.close(index);
        //}catch(err){}

    }

    /**
     * 转移栏目
     * newsid 要转移的文章的id
     * columnid 要转移的文章所在的栏目id
     */
    function changeColumn(newsid, columnid) {
        var url = '<%=basePath %>news/newsChangeColumnForSelectColumn.do?newsid=' + newsid + '&columnid=' + columnid;
        layer.open({
            type: 2,
            title: '转移到其他栏目',
            area: ['250px', '500px'],
            shadeClose: true, //开启遮罩关闭
            content: url
        });
    }
</script>

${autoJumpTemplateEdit}

</body>
</html>